import React from "react";
import {Menu} from 'antd/lib';

import routeWithUserSession from "@/components/ApplicationArea/routeWithUserSession";
import PageHeader from "@/components/PageHeader";
import Enums from "@/services/enums";
import "./KpiList.less";
import routes from "@/services/routes";
class KpiList extends React.Component {
  state = {
    loading: true,
    orgstruct_enum: '',
    items: [],
  };

  componentWillMount() {
    Enums.items('orgstruct_enum').then(data => {
      data && this.setState({
        items: data,
        loading: false,
        orgstruct_enum: data[0].value,
      });
    });
  };

  tabsClick = e => {
    this.setState({
      orgstruct_enum: e.key,
    });
  };

  renderTabs() {
    return (
      <Menu onClick={this.tabsClick} selectedKeys={[this.state.orgstruct_enum]} mode="horizontal">
      {this.state.items.map(item => (
        <Menu.Item key = {item.value}>
          {item.title}
        </Menu.Item>
      ))}
      </Menu>
    );
 };

  render() {
    if (this.state.loading || this.state.items.length === 0) return null;

    return (
      <div className="settings-screen">
        <div className="container">
          <PageHeader title="指标定义" />
          <div className="bg-white tiled">
            {this.renderTabs()}
            <div className="p-15">
            </div>
          </div>
        </div>
      </div>
    );
  }
}

routes.register(
  "Kpi.List",
  routeWithUserSession({
    path: "/kpi",
    title: "指标定义",
    render: pageProps => <KpiList {...pageProps}/>,
  })
);
// export default [
//   routeWithUserSession({
//     path: "/kpi",
//     title: "指标定义",
//     render: pageProps => <KpiList {...pageProps} />,
//   }),
// ];
